<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>


    <script>

        // 同步和异步
        //    同步：顺序执行   先烧水再泡茶
        //    异步：不按顺序     边烧水边撸代码



        // 少量的异步
        //    事件处理函数是异步的程序
        //    定时器是异步的程序



        // js代码的执行顺序
        //   1 优先执行所有的同步代码
        //   2 遇到异步就在旁边等着
        //   3 等到所有的同步代码执行完毕


        //  js 是一种单线程的语言

        // 事件循环  event事件 loop循环

        //    同步代码会顺序在主线程上执行
        //    遇到异步任务，会存在任务队列中
        //    所有同步任务在主线程上执行完毕   主线程就清空了
        //    异步任务不会排队，到达要执行的条件之后，在主线程上执行



        // 同步代码
        console.log(1);
        console.log(2);

        document.onclick = function() {
            console.log(666);
            console.log(777);
        }



        setInterval(function(){
            console.log(9);
        } ,20000)


        console.log(3);



    </script>
    
</body>
</html>